/* 文章详情页样式 */


/* 左侧 */

.Detail-Container {
    width: 100%;
    /* min-height: 100vh; */
    display: flex;
    flex-wrap: wrap;
}

.Aside-Content {
    min-height: 90.5vh;
    overflow-x: hidden;
    /* margin-top: 20px; */
}

.ArticleCard {
    width: 100%;
}

.User-Card {
    margin-top: 20px;
    padding: 0px;
}

.article-detail {
    /* padding: 20px; */
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.author-info {
    width: 100%;
    display: flex;
    margin-bottom: 10px;
}

.tag-content {
    width: 100%;
    display: flex;
    margin-bottom: 10px;
}

.title {
    font-size: 24px;
    font-weight: bold;
    margin-left: 0.3rem;
    margin-bottom: 10px;
}

.icon {
    margin-left: 15px;
}

.author {
    color: #555666;
    margin-right: 20px;
    font-size: 15px;
    padding-bottom: 10px;
}

.author-content {
    width: 95%;
    background-color: #f4f5f5;
    padding: 15px;
    margin: 10px auto 25px auto;
    border-radius: 16px;
    display: flex;
    flex-wrap: wrap;
}

.content {
    font-size: 16px;
    min-height: 60vh;
    width: 95%;
    margin: 10px auto 25px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    line-height: 1.5;
}


/* 文章内容下所有图片 */

.content>>>img {
    width: 80%;
    margin: 0 auto;
}

.createtime {
    color: #303133;
    margin-right: 10px;
}

.view {
    margin-right: 10px;
    color: #303133;
}

.like {
    color: #303133;
    margin-right: 10px;
}

.share {
    color: #303133;
}

.tag-text {
    width: 80px;
    margin: auto 0;
}

.optionContent {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.options {
    width: 100%;
    display: flex;
}

.creatorname {
    color: #222226;
    font-size: 16px;
    width: 100px;
    display: block;
    font-weight: font-weight;
}

.liked {
    color: red;
}

.optionContent>>>.el-card__body,
.el-main {
    display: flex;
    /* justify-content: space-between; */
    flex-wrap: wrap;
    /* line-height: 60px; */
}

.thumb {
    /* margin-left: auto; */
    background-color: #fff;
}

.CommentList {
    width: 100%;
}


/* 右侧 */

.Author-Content {
    width: 100%;
    padding: 10px 0;
    /* max-height: 50vh; */
}


/* 移动端样式 */

@media screen and (max-width: 767px) {
    .Detail-Container {
        display: flex;
        padding: 2rem 0;
    }
    .optionContent {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        width: 100%;
    }
    .ArticleCard {
        margin-top: 0.5rem;
    }
}